##<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script>

% for index,video_id in enumerate(c.video_ids):
	% if index == 0:
		<div class="ytplayercontainer visible_player" id="ytplayer${index}container">
	% else:
		<div class="ytplayercontainer invisible_player" id="ytplayer${index}container">
	% endif
		<div id="ytplayer${index}">
			You need Flash player 8+ and JavaScript enabled to view this video.
		</div>
	</div>
% endfor

<script type="text/javascript">
	var params = { allowScriptAccess: "always", wmode: "transparent" };
	var url = 'http://www.youtube.com/v/';
	var urlParams = '&enablejsapi=1&&rel=0&showinfo=0';
	% for index, video_id in enumerate(c.video_ids):
	var atts = { id: "ytplayer${index}" };
	swfobject.embedSWF(url + '${video_id}' + urlParams + '&playerapiid=' + 'ytplayer${index}',
		"ytplayer${index}", "480", "385", "8", null, null, params, atts);
	% endfor

	% for index in range(c.video_count):
	function onStateChange${index}(newState) {
		players.onStateChange(${index}, newState)
	}
	% endfor

	var players = new YouTubePlayerCollection();
	var updateId = setInterval(function() { players.update() }, 3000)

	/**********************/
	/* Callback functions */
	/**********************/
	function onYouTubePlayerReady(youtubeid) {
		var id = parseInt(youtubeid.slice('ytplayer'.length));

		var container = $('#ytplayer' + id + 'container')
		var player = $('#ytplayer' + id)[0]
		players.addPlayer(id, container, player)
		
		if (players.count == ${c.video_count}) {
			players.start();
		}
	}

	function shutdownPlayers() {
		clearInterval(updateId)
	}

</script>
